<template>
  <div class="app-container">
    <el-dialog
      title="编辑医院"
      :before-close="handleClose"
      :visible="editing" >
      <el-form   label-width="80px"  v-model="editmodel">
        <el-form-item label="名称">
          <el-input v-model="editmodel.name"></el-input>
        </el-form-item>
        <el-form-item label="最大打疫苗人数">
          <el-input v-model="editmodel.maxorder"></el-input>
        </el-form-item>


        <el-form-item label="操作">
          <el-button class="el-button--success" @click="doupdatedoctor">保存</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-form :inline="true" :model="formInline" class="demo-form-inline">
      <el-form-item label="医院名称">
        <el-input v-model="formInline.name" placeholder="医院名称"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="dosearch">查询</el-button>
      </el-form-item>
    </el-form>
    <el-table
      :data="list"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
    >
      <el-table-column align="center" label="ID" width="95">
        <template slot-scope="scope">
          {{ scope.$index }}
        </template>
      </el-table-column>
      <el-table-column label="名称">
        <template slot-scope="scope">
          {{scope.row.name}}
        </template>
      </el-table-column>

      <el-table-column label="最大每日打疫苗人数"  >
        <template slot-scope="scope">
          {{scope.row.maxorder}}
        </template>
      </el-table-column>



      <el-table-column
        align="center"
        prop="created_at"
        label="操作"
        width="200">
        <template slot-scope="scope">
          <el-button   v-loading.fullscreen.lock="loading" type="primary" @click="edit(scope.row)" size="mini">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      class="pager"
      background
      layout="prev, pager, next"
      :current-page="listQuery.currentpage"
      :page-size="listQuery.pagesize"
      @current-change="fetchData"
      :total="listQuery.total">
    </el-pagination>
  </div>
</template>

<script>
  import {  getHosptialList , updateHosptial,searchHosptial } from "@/api/admin";

  export default {
    data() {
      return {
        list: null,
        loading: true,
        hosptiallist:[],
        formInline:{},
        editing:false,
        editmodel:{

        },
        listQuery:{
          currentpage:1,
          pagesize:20,
          name:"",
          total:0,
        }
      };
    },
    created() {
      this.fetchData();
    },
    methods: {
      openandclose(e){
        if(e.status == 0 )
          e.status = 1;
        else{
          e.status =0
        }
        updateDoctor(e).then(res=>{
          console.log(res)
        })
      },
      doupdatedoctor(info){
        updateDoctor(this.editmodel).then(res=>{
          console.log(res)
        })
      },
      edit(item) {
        this.editmodel = item;
        this.editing = true;

      },
      fetchData(e) {
        if(e != undefined) this.listQuery.currentpage = e;
        this.loading = true;
        getHosptialList(this.listQuery).then((response) => {
          console.log("get list success")
          this.list = response.info;
          this.listQuery.currentpage = response.currentpage;
          this.listQuery.total = response.total;
          this.listQuery.totalpage = response.totalpage;
          this.loading = false;
        }).catch(err=>{
          this.loading = false;
        })

      },
      handleClose(done) {
        done();
        this.editing= false;

      },
      dosearch() {
        searchHosptial(this.formInline).then(res=>{
          console.log(res)
          this.list = res.info;
          this.listQuery.currentpage =1 ;
          this.listQuery.total = res.info.length;
          this.listQuery.totalpage = 1;
        })
        console.log(this.formInline);
      },
      disable:function(e){
        if(e.status == 0 )
          e.status = 1;
        else{
          e.status =0
        }
        updateDoctor(e).then(res=>{
          console.log(res)
        })
      }
    },
  };
</script>
<style>
  .pager{
    margin: 30px;
    float: right;
  }
</style>
